<template>
	<view class="addvidlist">
		<view class="font-lg text-center">添加视频</view>
		<view class="mt-1">视频标题：
			<input placeholder="请输入视频内容标题" type="text" v-model="addvideo.title" class="inaddtitle"/>
		</view>
		<view>
			<view>添加视频封面</view>
			<image @click="video_cover" src="../../static/up-img.png" class="img img1"></image>
			<image :src="addvideo.video_cover" class="img ml-2">
			
			<view class="d-flex j-sb">
				<view>上传视频：</view>
				<view @tap="addVideo()" v-model="addvideo.video_url" class="avideo">+ 添加视频</view>
			</view>
			<view v-if="!addvideo.video_url">
				<view class="uni-hello-addfile" @tap="addVideo()" v-model="addvideo.video_url">+ 添加视频</view>
			</view>
			<view v-else>
				<video :src="addvideo.video_url" class="video"></video>
			</view>
		</view>
		<button @click="queren()" class="qrbut">确认上传</button>
	</view>
</template>

<script>
	export default {
		props: {
			addvideo:null,
			mvideo:null,
		},
		data () {
			return {
				
			}
		},
		methods: {
			//确认上传视频
			queren(){
				this.mvideo.push(this.addvideo)
				console.log(this.addvideo)
				this.$refs.openAlertaddVideo.Close(); 
				// this.$emit('')
				
				this.addvideo={
					title: '',
					video_cover: '',
					video_url: '',
				};
			},
			
			//添加视频
			addVideo(){
				uni.chooseVideo({
					success: (res) => {
						console.log(res)
						res['path'] = res['tempFilePath']
						this.$comm.ossUpFile(res, (url) => {
							console.log(url,6666)
							// this.addvideo.video_url = url
							this.$set(this.addvideo,'video_url',url);
							// this.huodong.mvideo.push(this.addvideo)
							console.log(this.addvideo.video_url,this.huodong.mvideo)
						});
					}
				})
			},
			
			//添加视频封面
			video_cover(){
				this.addvideo.video_cover=''
				uni.chooseImage({
					count: 1,
					sizeType: ['original', 'compressed'],
					sourceType: ['album'],
					success: (res) => {
						console.log(res,6666)
						this.$comm.ossUpFile(res.tempFiles[0], (url) => {
							
							this.$set(this.addvideo,'video_cover',url);
							// this.addvideo.video_cover = url
							console.log(this.addvideo.video_cover,6666)
						});
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	@import '@/common/main.css';
	@import  '@/common/zcm-main.css';
	
	.addvidlist{
		background-color: #ffffff; 
		width: 650rpx; 
		border-radius: 30rpx; 
		padding: 50rpx;
		
		.inaddtitle{
		margin:10rpx 0 20rpx 0; 
		background-color: #F1F1F1; 
		border-radius: 10rpx; 
		height: 60rpx; 
		padding: 0 10rpx 0 20rpx;
		}
		
		.img{
			height: 150rpx; 
			width: 150rpx; 
			margin-top: 10rpx; 
			margin-bottom: 20rpx; 
			margin-right: 20rpx; 
			border-radius:5rpx
		}
		
		.img1{
			padding: 48rpx; 
			border: solid 5rpx #EDEDED; 
			border-radius: 5rpx;
		}
		
		.avideo{
			color: #fff; 
			background-color: #475dfc; 
			border-radius: 50rpx; 
			padding: 0 10rpx 0 10rpx;
		}
		
		.uni-hello-addfile {
		    text-align: center;
		    line-height: 200rpx;
		    background: #F1F1F1;
		    padding: 50rpx;
			height: 300rpx;
		    margin-top: 10px;
		    font-size: 35rpx;
		    color: #808080;
			margin-bottom: 20rpx;
		}
		
		.video {
			margin-bottom: 10rpx;
			width: 100%;
			height: 300rpx;
			margin-top: 10rpx;
		}
		
		.qrbut{
			text-align: center;
			background-color: #475dfc; 
			color: #fff; 
			margin-top: 50rpx;
		}
	}
	
</style>
